import { useTranslation } from 'react-i18next';
import logo from '../assets/images/logo.png'
import PrivacyDialog from './privacyDialog';
import { useState } from 'react'


const Footter = () => {
  const { t } = useTranslation()
  const [privacyDialogOpen, setPrivacyDialogOpen] = useState(false);

  return (
    <>
      <div className="bg-[#728D6B] w-full h-1 sm:h-4"></div>
      <div className="px-4 sm:px-[100px] flex justify-between pb-4 sm:pb-[100px] pt-2 sm:pt-[20px] bg-gradient-to-b from-[#E3F2DF] to-[rgba(115,142,108)]">
        <div className="w-[70%]">
          <img className="w-[30%] object-scale-down" src={logo} alt="" />
          <div className="my-2 sm:my-[20px]">
            {t('有意寻找卵子捐献者的父母，请通过以下方式联系我们fobb888888@gmail.com')}
          </div>
          <div>
            {t('如果您想查询我们的捐赠流程，请联系我们fobb888888@gmail.com')}
          </div>
        </div>
        <div className='text-[14px] underline cursor-pointer hover:text-orange-400 mt-2 text-[#333]' onClick={() => setPrivacyDialogOpen(true)}>法律声明</div>
      </div>
      <PrivacyDialog isModalOpen={privacyDialogOpen} onEvent={(e) => setPrivacyDialogOpen(e)} />
    </>
  )
}

export default Footter